<template>
  <view>
    <DefineTmp v-slot="{label,value,onEvent}">
      <view class="flex-between u-f-sl p-30 theme" @click="onEvent(value)">
        <view>{{ label }}</view>
        <view class="flex">
          <up-icon name="arrow-right"></up-icon>
        </view>
      </view>
    </DefineTmp>
    <UseTmp v-for="(item,index) of cookSettings" :key="index" :label="item.label" @event="console.log(1)"></UseTmp>
  </view>
</template>

<script setup lang="ts">
import {ref} from "vue";
import {cookSettings} from "@/util/options/system";
import {onLoad} from '@dcloudio/uni-app'
import {useThemeStore} from '@/store/theme'
import {createTemplate} from "@/util/template/DefineTemplate";

const {DefineTmp, UseTmp} = createTemplate()
const themeStore = useThemeStore()

const formData = ref({
  avatar: undefined,
  nickname: undefined,
  password: undefined,
  memberId: undefined,
  gender: 3,
  birthday: undefined,
  phone: undefined,
  email: undefined,
  address: undefined,
})


</script>


<style scoped lang="scss">
@import '@/static/css/index.css';

.theme {
  color: var(--text-color);
  border-bottom: 1rpx solid var(--border-color);
}

.u-page {
  padding: 0;
  flex: 1;
  background-color: #f3f4f6;

  &__item {

    &__title {
      color: #909399;
      background-color: #f3f4f6;
      padding: 15px;
      font-size: 15px;

      &__slot-title {
        color: #3c9cff;
        font-size: 14px;
      }
    }
  }
}


</style>
